<template>
	<view class="h5_padding">
		<view class="new_drugs_cell ">
			<image class="left" mode="aspectFit" :src="item.contentImage"></image>
			<view class="cont">
				<view class="line">
					<view class="name">商品名称：</view>
					<view class="con">{{item.title}}</view>
				</view>
				<view class="line">
					<view class="name">生产企业：</view>
					<view class="con">{{item.manufacturer}}</view>
				</view>

				<view class="line">
					<view class="name">剂量规格：</view>
					<view class="con">{{item.instructions}}</view>
				</view>

				<view class="line">
					<view class="name">适应症：</view>
					<view class="con">{{item.indications}}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: "new-drugs-cell",
		props: {
			item: {
				type: Object,
				default: {},
				required: true,
			}
		},
		data() {
			return {

			};
		}
	}
</script>

<style lang="scss" scoped>
	.new_drugs_cell {
		padding: 40rpx 20rpx;
		border-style: solid;
		border-width: 2rpx;
		border-color: #C0C0C0;
		margin-top: 40rpx;
		display: flex;
		justify-content: flex-start;

		.left {
			flex-grow: 0;
			flex-shrink: 0;
			margin-right: 20rpx;
			width: 278rpx;
			height: 176rpx;
			// background-color: #C0C0C0;
		}

		.cont {
			flex-grow: 1;
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			padding: 10rpx 0rpx;

			.line {
				display: flex;

				// flex-direction: column;
				.name {
					min-width: 130rpx;
					font-size: 22rpx;
					// font-family: PingFangSC-Medium, PingFang SC;
					// font-weight: 300;
					// color: #008796;
					line-height: 33rpx;
					letter-spacing: 1rpx;
				}

				.con {
					font-size: 22rpx;
					font-family: PingFangSC-Medium, PingFang SC;
					font-weight: 500;
					color: #999999;
					line-height: 33rpx;
					letter-spacing: 1rpx;

					overflow: hidden;
					-webkit-line-clamp: 2;
					text-overflow: ellipsis;
					display: -webkit-box;
					-webkit-box-orient: vertical;
				}
			}


		}
	}

	@media screen and (max-width:750px) {
		.new_drugs_cell {
			.left {
				flex-grow: 0;
				flex-shrink: 0;
				margin-right: 20rpx;
				width: 174rpx;
				height: 160rpx;
				// background-color: #C0C0C0;
			}

			.cont {

				.line {


					.name {
						min-width: 130rpx;
						font-size: 28rpx;
						// font-family: PingFangSC-Medium, PingFang SC;
						// font-weight: 300;
						// color: #008796;
						line-height: 33rpx;
						letter-spacing: 1rpx;
					}

					.con {
						font-size: 24rpx;

						overflow: hidden;
						-webkit-line-clamp: 2;
						text-overflow: ellipsis;
						display: -webkit-box;
						-webkit-box-orient: vertical;
						
						  overflow: hidden;
							word-break: break-all;  /* break-all(允许在单词内换行。) */
							text-overflow: ellipsis;  /* 超出部分省略号 */
							display: -webkit-box; /** 对象作为伸缩盒子模型显示 **/
							-webkit-box-orient: vertical; /** 设置或检索伸缩盒对象的子元素的排列方式 **/
							-webkit-line-clamp: 2; /** 显示的行数 **/
					}
				}


			}
		}
	}
</style>
